<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="divport" content="width=device-width, initial-scale=1.0">
    <title>西药处方详情</title>

    <style>
        .content_box {
            width: 100%;
            background: #f5f5f5;
            min-height: 100%;
            display: flex;
            flex-direction: column;
        }

        .detail_info {
            min-height: 200px;
            background: #FFFFFF;
            border-radius: 20px;
            margin: 24px 24px 0px 24px;
        }

        .detail_info .de_top {

        }

        .de_top .info {
            padding: 60px 30px 30px 30px;
            border-bottom: 1px solid #CCCCCC;
            position: relative;
        }

        .de_top .info .zhang {
            position: absolute;
            top: 40px;
            left: 40%;
        }

        .de_top .info .zhang img {
            width: 148px;
            height: 148px;
        }

        .de_top .info .hos {
            position: relative;
        }

        .de_top .info .hos .text {
            width: 100%;
            text-align: center;
            color: #242424;
            font-size: 34px;
        }

        .de_top .info .hos .statu {
            width: 95px;
            height: 40px;
            line-height: 40px;
            border: 1px solid #37CD87;
            border-radius: 4px;
            font-size: 24px;
            color: #37CD87;
            text-align: center;
            position: absolute;
            top: 4px;
            right: 50px;
        }

        .de_top .info .hos .noAudit {
            border: 1px solid #F16229;
            color: #F16229;
        }

        .de_top .info .hos .invalid {
            border: 1px solid #B3B3B3;
            color: #B3B3B3;
        }

        .de_top .info .dianzi {
            width: 100%;
            height: 44px;
            text-align: center;
            font-size: 44px;
            font-family: PingFang SC;
            font-weight: bold;
            color: #242424;
            margin-top: 30px;
            margin-bottom: 60px;
        }

        .de_top .info .pihao {
            width: 100%;
            height: 30px;
        }

        .de_top .info .pihao .p_l {
            float: left;
            font-size: 28px;
            font-family: PingFang SC;
            font-weight: 400;
            color: #37CD87;
        }

        .de_top .info .pihao .p_r {
            float: right;
            font-size: 28px;
            font-weight: 400;
            /*color: #B3B3B3;*/
        }

        .de_top .info .person {
            width: 100%;
            margin-top: 50px;
        }

        .de_top .info .person .name {
            font-size: 28px;
            font-weight: 500;
            color: #242424;
            width: 33.33%;
            display: inline-block;
            float: left;
        }

        .de_top .info .person .sex {
            text-align: center;
            font-size: 28px;
            font-weight: 500;
            color: #242424;
            width: 33.33%;
            display: inline-block;
        }

        .de_top .info .person .age {
            text-align: center;
            font-size: 28px;
            font-weight: 500;
            color: #242424;
            width: 33.33%;
            display: inline-block;
            text-align: right;
            float: right;
        }

        .de_top .info .keshi {
            font-size: 28px;
            font-weight: 500;
            color: #242424;
            margin-top: 30px;
        }

        .de_top .problem {
            /* padding: 48px 30px 48px 30px; */
            padding: 48px 0px 48px 0px;
        }

        .de_top .problem .zhu {
            font-size: 38px;
            color: #242424;
            margin-bottom: 30px;
            padding-left: 30px;
            padding-right: 30px;
        }

        .de_top .problem .fu {
            font-size: 30px;
            color: #242424;
            margin-bottom: 55px;
            /* width: 100%; */
            width: 640px;
            word-wrap: break-word;
            word-break: break-all;
            padding-left: 30px;
            padding-right: 30px;
        }

        .de_top .problem .yao {
            margin-bottom: 28px;
            padding-left: 30px;
            padding-right: 30px;
        }

        .de_top .problem .yao .yaoName {
            height: 50px;
        }

        .de_top .problem .yao .yaoName .name {
            float: left;
            color: #242424;
            font-size: 32px;
        }

        .de_top .problem .yao .yaoName .num {
            float: right;
            color: #B3B3B3;
            font-size: 26px;
        }

        .de_top .problem .yao .yongfa {
            color: #666666;
            font-size: 28px;
        }

        .signature {
            margin-top: 20px;
            height: 326px;
            background: #FDFDFD;
            border-radius: 20px;
            margin-left: 24px;
            margin-right: 24px;
            padding: 10px 0px 10px 30px;
        }

        .signature .oneLine, .signature .twoLine, .signature .threeLine {
            width: 50%;
            /* display: inline-block; */
            float: left;
            font-size: 30px;
            line-height: 96px;
            height: 100px;
        }

        .signature .oneLine img {
            width: 160px;
            width: 100px;
            vertical-align: middle;
        }

        .tips {
            margin-bottom: 50px;
        }

        .tips .name {
            color: #B3B3B3;
            font-size: 24px;
            margin-top: 56px;
            margin-bottom: 30px;
            padding-left: 30px;
        }

        .tips .tip {
            color: #B3B3B3;
            font-size: 25px;
            padding-left: 30px;
            padding-right: 28px;
            line-height: 44px;
        }
    </style>
</head>
<body>
<div class="content_box">
    <div class="detail_info">
        <div class="de_top">
            <!-- 个人信息 -->
            <div class="info">
                <div class="zhang"><img src="${prescriptionSetting.sign}"></div>
                <div class="hos">
                    <div class="text">${prescriptionSetting.title}</div>
                    <#if detail.status == 1>
                        <div class="statu noAudit">未审核</div>
                    </#if>
                    <#if detail.status == 2>
                        <div class="statu">已审核</div>
                    </#if>
                    <#if detail.status == 3>
                        <div class="statu invalid">已失效</div>
                    </#if>
                    <#if detail.status == 4>
                        <div class="statu invalid">作废</div>
                    </#if>
                </div>
                <div class="dianzi">电子处方笺</div>
                <div class="pihao">
                    <span class="p_l">NO.${detail.prescriptionId}</span>
                    <span class="p_r">${prescriptionTime}</span>
                </div>
                <div class="person">
                    <div class="name">姓名：${detail.patientName}</div>
                    <div class="sex">性别：${detail.patientSex}</div>
                    <div class="age">年龄：${detail.patientAge}</div>
                </div>
                <div class="keshi">科室：${detail.depName}</div>
            </div>
            <!-- 问题 -->
            <div class="problem">
                <div class="zhu">主诉：</div>
                <div class="fu">${appeal}</div>
                <div class="zhu">诊断：</div>
                <div class="fu">${conclusion}</div>
                <div class="zhu">Rp:</div>
                <#if detail.westDrugList??>
                    <#list detail.westDrugList as item>
                        <div class="yao">
                            <div class="yaoName">
                                <div class="name">${item.drugCommonName !''}</div>
                                <div class="num">*${item.cnt !''}</div>
                            </div>
                            <div class="yongfa">${item.spec !''} ${item.useMethod !''} ${item.useAmount!''} </div>
                        </div>
                    </#list>
                </#if>
            </div>
        </div>
    </div>

    <!-- 医生签字 -->
    <div class="signature">
        <#if roleInfoDTOList?? >
            <#list roleInfoDTOList as info>
                <div class="oneLine">
                    <span>${info.roleName}：</span>
                    <#if info.url??>
                        <img src="${info.url}">
                    </#if>
                </div>
            </#list>
        </#if>
    </div>

    <#if tips??>
        <div class="tips">
            <div class="name">温馨提示</div>
            <#list tips as tip>
                <div class="tip">${tip_index+1}.${tip.tips}</div>
            </#list>
        </div>
    <#else>
        <div class="tips">
            <div class="name">温馨提示</div>
            <div class="tip">1.本处方仅供互联网网通医院使用，自行下载配药不具有处方效力。</div>
            <div class="tip">2.按照卫生部、国家中医药管理局卫医发【2002】24号文件规定：为保证患者用药安全，药品已经出，不得退换。</div>
            <div class="tip">3.按照网订店送的方式，您的处方将有门店发药药师审核，确认用药无误签字后方可生效。</div>
        </div>
    </#if>

</div>

</body>
</html>